<template>
<div class="">
  <Row>
    <Col span="12" class="title clearfix">体检结果情况:</Col>
  </Row>
  <div class="line"></div>
  <div class="MainBox">
    <Form :model="PhysicalExamination" label-position="left" :label-width="50">
      <div class="tip">请选择需要查看/上传的类别</div>
      <Cascader :data="data" v-model="value1" v-on:on-change="selectChange"></Cascader>
      <div v-if="visible">
        <UploadHelperForClass :showdata="innerlist" :class12="class12" :class3="1" label="国内检查照片" />
        <UploadHelperForClass :showdata="outerlist" :class12="class12" :class3="2" label="国外检查照片" />
      </div>
    </Form>
  </div>
</div>
</template>
<script>
import UploadHelperForClass from '../components/UploadHelperForClass'
import SubmitButton from "../components/SubmitButton"
import Store from '../store'
import Vue from 'vue'
import api from '../js/axios-module'
export default {
  data() {
    return {
      PhysicalExamination: {

        pictures: {
          "1-1": {
            innerlist: [],
            outerlist: []
          },
          "1-2": {
            innerlist: [],
            outerlist: []
          },
          "1-3": {
            innerlist: [],
            outerlist: []
          },
          "1-4": {
            innerlist: [],
            outerlist: []
          },
          "1-5": {
            innerlist: [],
            outerlist: []
          },
          "2-1": {
            innerlist: [],
            outerlist: []
          },
          "2-2": {
            innerlist: [],
            outerlist: []
          },
          "2-3": {
            innerlist: [],
            outerlist: []
          },
          "2-4": {
            innerlist: [],
            outerlist: []
          },
        }
      },
      visible: false,
      isSelect: false,
      bodyType: "",
      //存储照片
      innerlist: [],
      //存储照片
      outerlist: [],
      key: "",
      class12:'',
      class3:'',
      value1: [],
      data: [{
          value: '1',
          label: '女方检查',
          children: [{
              value: '1',
              label: '激素类'
            },
            {
              value: '2',
              label: '传染病类'
            },
            {
              value: '3',
              label: '血液常规'
            },
            {
              value: '4',
              label: 'B超'
            },
            {
              value: '5',
              label: '其他（如甲功、抗体等）'
            }
          ]
        },
        {
          value: '2',
          label: '男方检查',
          children: [{
              value: '1',
              label: '传染病类'
            },
            {
              value: '2',
              label: '精液常规类'
            },
            {
              value: '3',
              label: '血液常规'
            },
            {
              value: '4',
              label: '其他（如抗体等）'
            }
          ],
        }
      ]
    }
  },
  created: function() {
    var item = Store.fetch(Store.PHYSICALEXAMINATION_KEY)
    if (item.pictures == undefined) {
      item.pictures = this.PhysicalExamination.pictures
    } else {
      this.PhysicalExamination = item
    }
  },
  components: {
    UploadHelperForClass,
    SubmitButton
  },
  methods: {
    selectChange: function(value, selectedData) {
      this.class12 = value[0] + '-' + value[1];
      this.visible = true;
      var key = value[0] + "-" + value[1];
      this.key = key;
      this.innerlist = [];
      this.outerlist = [];
      api.getPhysicalExamination(key).then(response => {
        this.innerlist = response.data.data[1]
        this.outerlist = response.data.data[2]
      }, err => {
        this.$Message.error('获取数据失败,请稍后再试');
      })
    },
  },
  watch: {
    'PhysicalExamination.pictures': {
      handler: function(val, oldval) {
      },
      deep: true
    }
  }

}
</script>
<style scoped>
.tip {
  font-size: 14px;
  margin-bottom: 10px
}
</style>
